<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html">
<html>
<head>
<title>商品列表</title>
<jsp:include page="./include/header.jsp"></jsp:include>
</head>
<body>
<jsp:include page="./include/head.jsp"></jsp:include>
<jsp:include page="./include/banner.jsp"></jsp:include>
<!--content-->
		<div class="product">
			<div class="container">
						<div class="col-md-3 product-bottom">
			<!--categories-->
			<div class="categories animated wow fadeInUp animated" data-wow-delay=".5s" >
					<h3>分类</h3>
					<ul class="cate">
						<li><i class="glyphicon glyphicon-menu-right" ></i><a href="products.html">热销</a> <span>(15)</span></li>
						<li><i class="glyphicon glyphicon-menu-right" ></i><a href="products.html">男装</a> <span>(16)</span></li>
							<ul>
								<li><i class="glyphicon glyphicon-menu-right" ></i><a href="products.html">配饰</a> <span>(2)</span></li>
								<li><i class="glyphicon glyphicon-menu-right" ></i><a href="products.html">夹克</a> <span>(5)</span></li>
								<li><i class="glyphicon glyphicon-menu-right" ></i><a href="products.html">牛仔裤</a> <span>(1)</span></li>
								<li><i class="glyphicon glyphicon-menu-right" ></i><a href="products.html">套装</a> <span>(1)</span></li>
								<li><i class="glyphicon glyphicon-menu-right" ></i><a href="products.html">鞋子</a> <span>(0)</span></li>
							</ul>
						<li><i class="glyphicon glyphicon-menu-right" ></i><a href="products.html">新品推荐</a> <span>(15)</span></li>
						<li><i class="glyphicon glyphicon-menu-right" ></i><a href="products.html">女装</a> <span>(15)</span></li>
							<ul>
								<li><i class="glyphicon glyphicon-menu-right" ></i><a href="products.html">配饰</a> <span>(2)</span></li>
								<li><i class="glyphicon glyphicon-menu-right" ></i><a href="products.html">裙子</a> <span>(1)</span></li>
								<li><i class="glyphicon glyphicon-menu-right" ></i><a href="products.html">鞋子</a> <span>(0)</span></li>
								<li><i class="glyphicon glyphicon-menu-right" ></i><a href="products.html">短裤</a> <span>(4)</span></li>
							</ul>
					</ul>
				</div>
		<!--//menu-->
		<!--price-->
				<div class="price animated wow fadeInUp animated" data-wow-delay=".5s" >
					<h3>价格</h3>
					<div class="price-head">
					<div class="col-md-6 price-head1">
                                        <div class="price-top1">
                                            <span class="price-top">￥</span>
                                            <input type="text"  value="0">
                                        </div>
                                    </div>
									<div class="col-md-6 price-head2">
                                        <div class="price-top1">
                                            <span class="price-top">￥</span>
                                            <input type="text"  value="500">
                                        </div>
                                    </div>
									<div class="clearfix"></div>
                                    </div>
                                    </div>
			<!--//price-->
			<!--colors-->
			<div class="colors animated wow fadeInLeft animated" data-wow-delay=".5s" >
					<h3>颜色</h3>

                                        <div class="color-top">
                                            <ul>
												<li><a href="#"><i></i></a></li>
												<li><a href="#"><i class="color1"></i></a></li>
												<li><a href="#"><i class="color2"></i></a></li>
												<li><a href="#"><i class="color3"></i></a></li>
												<li><a href="#"><i class="color4"></i></a></li>
												<li><a href="#"><i class="color5"></i></a></li>
												<li><a href="#"><i class="color6"></i></a></li>
												<li><a href="#"><i class="color7"></i></a></li>
											</ul>
                                        </div>
                                    </div>
									
                                 
			<!--//colors-->
		<div class="sellers animated wow fadeInLeft" data-wow-delay=".5s">
					
								<h3 class="best">为你推荐</h3>
					<div class="product-head">
					<div class="product-go">
						<div class=" fashion-grid">
									<a href="single.html"><img class="img-responsive " src="images/pcc2.jpg" alt=""></a>
									
								</div>
							<div class=" fashion-grid1">
								<h6 class="best2"><a href="single.html">时尚衣饰 </a></h6>
								<span class=" price-in1"> <del>￥500.00</del>￥400.00</span>
								<p>穿出你的风格</p>
							</div>
								
							<div class="clearfix"> </div>
							</div>
							<div class="product-go">
						<div class=" fashion-grid">
									<a href="single.html"><img class="img-responsive " src="images/pcc3.jpg" alt=""></a>
									
								</div>
							<div class=" fashion-grid1">
								<h6 class="best2"><a href="single.html">魅力男人 </a></h6>
								<span class=" price-in1"> <del>￥300.00</del>$260.00</span>
								<p>秀出你的品味</p>
							</div>
							<div class="clearfix"> </div>
							</div>
							
							</div>
				</div>
				<!---->
 	</div>
			<div class="col-md-9 animated wow fadeInRight" data-wow-delay=".5s">
				<div class="mens-toolbar">
						<p>所有商品</p>
	                
					 <p class="showing">筛选条件
			            <select>
			                  <option value=""> 名字</option>
			                  <option value="">  尺码</option>
			                    <option value=""> 颜色 </option>
			                    <option value=""> 价格 </option>
			            </select>
			          </p>     	      
                	<div class="clearfix"></div>		
		        </div>
		      </div>

<c:forEach items="${goods}" var="g">
<div class="mid-popular">
				<div class="col-sm-4 item-grid item-gr  simpleCart_shelfItem">
							<div class="grid-pro">
								<div  class=" grid-product " >
									<figure>		
										<a href="#">
											<div class="grid-img">
												<img  src="${g.img}" class="img-responsive" alt="爱购物">
											</div>		
										</a>		
									</figure>	
								</div>
								<div class="women">
									<a href="#"><img src="images/ll.png" alt=""></a>
									<h6><a href="#">${g.goodname}</a> </h6>
									<h6 id="isbn">${g.factory}</h6>
									<p ><del>￥${g.price}</del><em class="item_price">￥${g.discount}</em></p>
									<a style="cursor: pointer" data-text="Add To Cart" class="but-hover1 item_add" id="isbn_input">加入购物车</a>
								</div>
							</div>
						</div>
		  			</div>
</c:forEach>	
  <div class="nextpage">
			<div class=" cart-total">
				 <div class="price-details">			
				 	<a href="index.jsp">上一页</a>		 
				</div>
			</div>
</div>
<script>
	$('#isbn_input').click(function(){
		var html = $(isbn).html(); 
		alert("加入购物车成功");
		$.post('addtocar.do', {isbn: html}, function(data){
			console.log(data);
		},'json');	
	});	
</script>			
</body>
</html>